define(['jquery'],function($){
	class LoadHeaderAndFooter{
		constructor(){
			this.loadHeader()
			this.loadFooter()
		}
		loadHeader(){
			$('header').load('/html/include/header.html',()=>{
					this.addListener()
			})
		}
		addListener(){
			$('.search-box input').on('keyup',this.suggestHandler)
			$('.suggest').delegate('div','click',this.suggestClickHandler)
		}
		suggestClickHandler(e){
			$('.search-box input').val($(e.target).html())
			$('.suggest').empty();
		}
		suggestHandler(e){
			const _val=$(e.target).val();
			const _url=`https://suggest.taobao.com/sug?code=utf-8&q=${_val}&callback=?`;
			$.getJSON(_url,(data)=>{
				const html=data.result.map(curr=>`<div>${curr[0]}</div>`).join('');
				$('.suggest').html(html);
				

			})
		}
		loadFooter(){
			$('footer').load('/html/include/footer.html')
		}
	
	}
	return new LoadHeaderAndFooter;
})
